<template>
  <div class="view-container">

    <header class="view-header">
      <div class="header-container">
        <div class="header-title">
          <i class="el-icon-s-grid"></i>
          <span>收藏夹</span>
        </div>
        <div class="header-form">
          <div class="header-form-item">
            <el-button type="danger" :loading="delLoading" icon="el-icon-delete" @click="del">{{isBatchesDel}}</el-button>
          </div>
        </div>
      </div>
    </header>

    <section class="table-container view-section">
      <el-table
        ref="table"
        :data="tableData"
        stripe
        border
        @selection-change="handleSelectionChange"
        @row-click="handleRowClick"
      >
        <el-table-column type="selection" align="center"/>
        <el-table-column label="标题">
          <template slot-scope="scope">
            <el-link @click="go(scope.row.favUrl)">{{ scope.row.favTitle }}</el-link>
          </template>
        </el-table-column>
        <el-table-column prop="favType" label="类别" width="120" align="center"></el-table-column>
        <el-table-column sortable prop="created" label="收藏时间" width="150" align="center"
                         :formatter="createdFmt"></el-table-column>
      </el-table>
    </section>
    <footer>
      <el-pagination
        :page-sizes="[10, 20, 50, 100]"
        style="text-align: right"
        layout="total, sizes, prev, pager, next, jumper"
        :total="page.total"
        :page-size="page.size"
        @size-change="handleSizeChange"
        @current-change="handleCurrentChange"
      />
    </footer>
  </div>
</template>

<script>
  import listMixin from '@/mixin/listMixin'
  import SeleAllapi from '@/api/shouzang/SeleAll'

  export default {
    name: '',
    mixins: [listMixin],
    data() {
      return {
        mixinParams: {
          addUrl: '',
          editUrl: '',
          propertyName: 'favId',
          API: SeleAllapi,
          deleteMethod: 'delflot'
        }
      }
    },
    created() {
    },
    methods: {
      createdFmt(row) {
        return this._util.format(row.created)
      },
      go(url){
        location.href = /^http:\/\/([0-9]+.){3}[0-9]+:[0-9]+/.exec(location.href)[0] + url
      },
      fetchData() {
        SeleAllapi.SelectShouFen(this.title).then(res => {
          this.tableData = res.records
          this.page.total = res.total
        })
      }
    }
  }
</script>

<style scoped lang="scss">
  /*.zhanshi .chaspan {
    display: flex;
    justify-content: center;
    background-color: rgb(242, 242, 242);
    width: 100%;
  }*/
</style>
